/**
 * Created by 123 on 2017/12/7.
 */

import React, {Component} from 'react';
import {
  Platform,
  StyleSheet,
  Text,
  View,
  Button,
  Image,
  ScrollView,
  Alert,
} from 'react-native';
import {DatePicker, List, Modal} from 'antd-mobile';
import {Actions} from 'react-native-router-flux'
import  HorizontalBody from './HorizontalBody';
import CheckBox from 'react-native-checkbox'
import CropView from './CropView';
const imgDefault = require('../../assets/imgs/img_default.png');
const nowTimeStamp = Date.now();
const now = new Date(nowTimeStamp);
import moment from 'moment';
import Dialog from '../../routes/DialogTip'
//现场拍照组件
import UIPhoto from '../../components/photograph';
//签字组件
import UISign from '../../routes/Sign';
import Colors from '../../assets/colors';

class RectifyBill extends React.Component {
  state = {
    date: now
  }

  render() {

    const {
      projectName, checkTime, supervisor, buildCorp, consCorp, superCorp,paramView, crops, param,seriousGrade, handleResult,
      setSupervisorImgs, setCheckPlace, setTroubles, setCurrentImg, changeImportLevel, changeConductResult,
      setRectifyTime, setRectifyContent, setCorpImgs, setCheckTime, setWhereTroubles, commitRectifyBill,hasDone,
      liveImages, signImages, showModal, missModal, JDSignature, SGImgs, JSImgs, JLImgs, SGSignature,
      JSSignature, JLSignature,dialogText,change,text,addOneItem,clearThisItem,
      thisBoxChecked,showRectifyBill,addPictures,cropsNext,shenHeGouXuan
    } = this.props;

    const fun = {
      setSupervisorImgs, setCheckPlace, setTroubles, setCurrentImg, changeImportLevel, changeConductResult,
      setRectifyTime, setRectifyContent, setCorpImgs, setWhereTroubles,change,addOneItem,clearThisItem
    };

    let showCrops = paramView;
    for (let i = 0; i < showCrops.length; i++) {
      for (let j = 0; j < seriousGrade.length; j++) {
        if (showCrops[i].importLevel === seriousGrade[j].value) {
          showCrops[i].importLevel = seriousGrade[j].label;
          break;
        }
      }
      for (let j = 0; j < handleResult.length; j++) {
        if (showCrops[i].conductResult === handleResult[j].value) {
          showCrops[i].conductResult = handleResult[j].label;
          break;
        }
      }
    }

    // let thisCrops = crops;
    // crops.map((val,index) => {
    //     (val.typeId == 4 || val.typeId == 5 || val.typeId == 6 )?null:
    //       val.id ===''?null:
    //         thisCrops.push(val)
    // })

    return (
      <View style={styles.container}>
        <ScrollView>

          <View style={styles.horizontalStyle}>
            <View style={{flex:1}}>
              <HorizontalBody name="工程名称">
                <Text style={styles.contentStyle}>{projectName}</Text>
              </HorizontalBody>
            </View>
            <View style={{flex:1}}>
              <HorizontalBody name="检查日期">

                <List.Item arrow="horizontal" style={{flex:1,height:50}}>
                  {
                    moment(new Date()).format('YYYY-MM-DD')
                  }
                </List.Item>

              </HorizontalBody>
              <View style={styles.lineStyle}/>
            </View>
          </View>

          <HorizontalBody name="监督员">
            <Text style={styles.contentStyle}>{supervisor}</Text>
          </HorizontalBody>
          <View style={styles.lineStyle}/>
          <HorizontalBody name="监督员签名">
            <UISign signWordType='JDSignature' signWordAction='RectifyBill'/>
          </HorizontalBody>

          <View style={styles.lineStyle}/>

          {
              param.map((val, index) => (
              <View key={index}>
                <CropView data={val}
                          seriousGrade={seriousGrade}
                          handleResult={handleResult}
                          type={val.type}
                          typeId={val.typeId}
                          fun={fun}
                          text = {val.text}
                          addPictures={addPictures}
                          liveImages={liveImages}/>
              </View>
            ))
          }

          <View style={styles.lineStyle}/>
          <View style={{flex:1}}>
            <HorizontalBody name="整改单位">

              <View style={{display:'flex',flexDirection:'row'}}>
                  {
                    crops.map((val,index)=>(
                        <View style={{flex:1,flexDirection:'row'}} key={index}>
                          {
                            val.name === ''?null:
                              <View style={{marginTop:12,marginLeft:20}}>
                                <CheckBox
                                  label=''
                                  checked={val.thisChecked}
                                  onChange={()=>{thisBoxChecked(val.id,val.thisChecked,crops)}}
                                />
                              </View>
                          }
                          {
                            val.name === ''?null:
                              <View style={{flex:1}}>
                                <Text
                                  style={{flex:1,fontSize:16,justifyContent: 'center',paddingTop:13,paddingLeft:10}}
                                >{val.name}-{val.type}</Text>
                              </View>
                          }
                        </View>
                    ))
                  }
              </View>

            </HorizontalBody>
          </View>

          <View style={styles.lineStyle}/>
          <View style={{flex:1}}>
            <HorizontalBody name="审核单位">

              <View style={{display:'flex',flexDirection:'row'}}>
                {
                  cropsNext.map((val,index)=>(
                    <View style={{flex:1,flexDirection:'row'}} key={index}>
                      {
                        val.name === ''?null:
                          <View style={{marginTop:12,marginLeft:20}}>
                            <CheckBox
                              label=''
                              checked={val.thisChecked}
                              onChange={()=>{shenHeGouXuan(val.id,val.thisChecked,cropsNext)}}
                            />
                          </View>
                      }
                      {
                        val.name === ''?null:
                          <View style={{flex:1}}>
                            <Text
                              style={{flex:1,fontSize:16,justifyContent: 'center',paddingTop:13,paddingLeft:10}}
                            >{val.name}-{val.type}</Text>
                          </View>
                      }
                    </View>
                  ))
                }
              </View>

            </HorizontalBody>
          </View>


          <View style={styles.lineStyle}/>
            <View style={{display:'flex',flexDirection:'column'}}>
              <HorizontalBody name="建设单位签字">
                <View style={{flex:1}}>
                  <UISign signWordType='JSSignature' signWordAction='RectifyBill'/>
                  <View style={styles.lineStyle}/>
                </View>
                <View style={styles.lineStyle}/>
              </HorizontalBody>
            </View>

            <View style={{display:'flex',flexDirection:'column'}}>
              <HorizontalBody name="施工单位签字">
                <View style={{flex:1}}>
                  <UISign signWordType='SGSignature' signWordAction='RectifyBill'/>
                  <View style={styles.lineStyle}/>
                </View>
                <View style={styles.lineStyle}/>
              </HorizontalBody>
            </View>
            <View style={{display:'flex',flexDirection:'column'}}>
              <HorizontalBody name="监理单位签字">
                <View style={{flex:1}}>
                  <UISign signWordType='JLSignature' signWordAction='RectifyBill'/>
                  <View style={styles.lineStyle}/>
                </View>
                <View style={styles.lineStyle}/>
              </HorizontalBody>
            </View>

            {/*<View style={styles.lineStyle}/>*/}
            {/*<View style={{display:'flex',flexDirection:'column'}}>*/}
                {/*<HorizontalBody name="勘察单位签字">*/}
                    {/*<View style={{flex:1}}>*/}
                        {/*<UISign signWordType='KCSignature' signWordAction='RectifyBill'/>*/}
                        {/*<View style={styles.lineStyle}/>*/}
                    {/*</View>*/}
                    {/*<View style={styles.lineStyle}/>*/}
                {/*</HorizontalBody>*/}
            {/*</View>*/}
            {/*<View style={styles.lineStyle}/>*/}
            {/*<View style={{display:'flex',flexDirection:'column'}}>*/}
                {/*<HorizontalBody name="设计单位签字">*/}
                    {/*<View style={{flex:1}}>*/}
                        {/*<UISign signWordType='SJSignature' signWordAction='RectifyBill'/>*/}
                        {/*<View style={styles.lineStyle}/>*/}
                    {/*</View>*/}
                    {/*<View style={styles.lineStyle}/>*/}
                {/*</HorizontalBody>*/}
            {/*</View>*/}
            {/*<View style={styles.lineStyle}/>*/}
            {/*<View style={{display:'flex',flexDirection:'column'}}>*/}
                {/*<HorizontalBody name="检测单位签字">*/}
                    {/*<View style={{flex:1}}>*/}
                        {/*<UISign signWordType='JCSignature' signWordAction='RectifyBill'/>*/}
                        {/*<View style={styles.lineStyle}/>*/}
                    {/*</View>*/}
                    {/*<View style={styles.lineStyle}/>*/}
                {/*</HorizontalBody>*/}
            {/*</View>*/}
          <View style={styles.lineStyle}/>
          <View style={{display:'flex',flexDirection:'row'}}>

            <View style={{flex:1}}>
              <View style={styles.BtnContainer}>
                <Text style={styles.btnText} onPress={()=>showRectifyBill(true)}>预览</Text>
              </View>
            </View>
            <View style={{flex:1}}>
              <View style={styles.BtnContainer}>
                <Text style={styles.btnText} onPress={hasDone?() =>{alert('正在提交')}:()=>commitRectifyBill()}>提交</Text>
              </View>
            </View>
            <View style={{flex:1}}>
              <View style={styles.BtnContainer}>
                <Text style={styles.btnText} onPress={()=>Actions.pop()}>取消</Text>
              </View>
            </View>
          </View>
          <Modal
            visible={showModal}
            transparent
            maskClosable={true}
            title="表单"
            footer={[{ text: '确定', onPress:() =>missModal(false)}]}
            style={{ height: 610,width:800,marginBottom:15 }}
          >

            <ScrollView style={{ height: 500 }}>
              <ItemH title='工程名' data={projectName}/>
              <ItemH title='检查日期' data={moment(new Date()).format('YYYY-MM-DD')}/>
              <ItemH title='监督员' data={supervisor}/>

              <View>
                <Text>监督员签名：</Text>
                {
                  JDSignature.length > 0 ? <ShowImage imgs={JDSignature}/> : <Text style={styles.textError}>未签名</Text>
                }
              </View>
              <View style={styles.lineStyle}/>
              {
                showCrops.map((val, index) => (
                    <View key={index}>
                      {/*{只有填写了问题的才显示与上传}*/}
                      {
                        val.troubleSelecton.length > 0 ? <View>
                            <ItemH title='公司类型' data={val.type}/>
                            <ItemH title='责任公司' data={val.name}/>
                            <ItemH title='检查地点' data={val.checkPlace}/>
                            <ItemH title='严重等级' data={val.importLevel}/>
                            <ItemH title='处理结果' data={val.conductResult}/>
                            <ItemH title='整改时间' data={moment(val.rectifyTime).format('YYYY-MM-DD')}/>
                            <ItemH title='整改内容' data={val.rectifyContent}/>

                            <Text>发现问题：</Text>
                            {
                                  val.troubleSelecton.map((val2, index2) => (
                                      <Text key={index2} style={{paddingLeft:100}}>
                                          {index2 + 1}：{val2.content}
                                      </Text>
                                  ))
                            }
                            <View>
                              <Text>现场照片：</Text>
                              {
                                <ShowImage imgs={val.imgs}/>
                              }
                              <Text>单位签名：</Text>
                              {
                                  <ShowImage imgs={val.cropSigns} />
                              }
                            </View>
                            <View style={styles.lineStyle}/>
                          </View> : null
                      }

                    </View>
                  )
                )
              }
            </ScrollView>

          </Modal>
        </ScrollView>
          {
              dialogText === ''?null:
                  <Dialog isShow={'true'} text={dialogText}/>
          }

      </View>
    );
  }
}

class ShowImage extends React.Component {
  render() {
    const {imgs}=this.props;
    return (
      <View style={{display:'flex',flexDirection:'row'}}>

        {
          imgs.length > 0 ? imgs.map((val, index) => (
              <View key={index}>
                <Image
                  style={{width:100,height:60}}
                  source={{uri: val.url}}
                />
              </View>
            )) : <Text style={styles.textError}>暂无图片</Text>
        }
      </View>
    )
  }
}

class ItemH extends React.Component {
  render() {
    const {title, data}=this.props;

    return (
      <View style={{display:'flex',flexDirection:'row'}}>
        <Text style={{width:100}}>{title}：</Text>
        {
          data == 'Invalid date' ? <Text style={styles.textError}>请选择整改时间</Text> :
            <Text style={{flex:1}}>{data}</Text>
        }

      </View>
    )
  }
}
const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: Colors.contentContainerBg,
  },
  imgStyle: {
    width: 100,
    height: 100,
  },
  horizontalStyle: {
    display: 'flex',
    flexDirection: 'row'
  },
  contentStyle: {
    backgroundColor: Colors.white,
    height: 50,
    paddingTop: 17,

  },
  lineStyle: {
    height: 1,
    backgroundColor: Colors.backgroundLightGray
  },
  horizontalText: {
    backgroundColor: Colors.navbarBackground,
    height: 50,
    paddingTop: 17,
    color: Colors.contentContainerBg,
    textAlign: 'center',
    fontSize: 20,
  },
  BtnContainer: {
    marginTop: 10,
    marginBottom: 10,
    backgroundColor: Colors.contentContainerBg,
    paddingBottom: 10,
    paddingLeft: 20,
    paddingRight: 20,

  },
  btnText: {
    color: '#fff',
    fontSize: 26,
    borderRadius: 10,
    textAlign: 'center',
    backgroundColor: Colors.btnPrimaryBg,
  },
  textError: {
    color: Colors.dataRedOuter
  }
});

export default RectifyBill;